<!DOCTYPE html>
<html lang="en">
<head>
    <title>WSD Admin</title>
    <meta charset="UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <link rel="stylesheet" href="__STATICURL__/css/bootstrap.min.css"/>
    <link rel="stylesheet" href="__STATICURL__/css/bootstrap-responsive.min.css"/>
    <link rel="stylesheet" href="__STATICURL__/css/uniform.css"/>
    <link rel="stylesheet" href="__STATICURL__/css/select2.css"/>
    <link rel="stylesheet" href="__STATICURL__/css/matrix-style.css"/>
    <link rel="stylesheet" href="__STATICURL__/css/matrix-media.css"/>
    <link rel="stylesheet" href="__STATICURL__/css/bootstrap-wysihtml5.css"/>
    <link href="__STATICURL__/font-awesome/css/font-awesome.css" rel="stylesheet"/>
    <link rel="stylesheet" href="__STATICURL__/js/datetimepicker/jquery.datetimepicker.css">

</head>
<body>
<include file="Common:header"/>
<div id="content">
    <!--breadcrumbs-->
    <div id="content-header">
        <div id="breadcrumb"><a href="__ROOT__/clover"><i class="icon-home"></i> 主页</a><a href="#"
                                                                                          class="current">推广链接</a></div>
    </div>
    <!--End-breadcrumbs-->
    <div class="container-fluid">

        <div class="row-fluid">
            <div class="span12">
                <div>
                    <!--<li class="field-name">选择开课日期</li>-->
                <span class="field-start">
                  <input id="starttime" placeholder="起始时间" value="<?=$start_time;?>" class="ipt" type="text">
                    <i class="calendar icon" data-for="js_start"></i>
                 </span>
                <span class="field-diff">至</li>
                <span class="field-end">
                  <input class="ipt" type="text" placeholder="截止时间" id="endtime" value="<?=$end_time?>">
                    <i class="calendar icon" data-for=""></i>
                </span>
                </div>
                <div class="widget-box" style="margin-top:0px;">
                    <div class="widget-title"><span class="icon"><i class="icon-th"></i></span>
                        <h5>统计链接平台</h5>
                    </div>
                    <div class="widget-content nopadding">
                        <div id="container" style="min-width:700px;height:400px"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!--Footer-part-->
<include file="Common:footer"/>
<!--end-Footer-part-->
<script src="__STATICURL__/js/jquery.min.js"></script>
<script src="__STATICURL__/js/jquery.ui.custom.js"></script>
<script src="__STATICURL__/js/bootstrap.min.js"></script>
<script src="__STATICURL__/js/jquery.uniform.js"></script>
<script src="__STATICURL__/js/select2.min.js"></script>
<script src="__STATICURL__/js/jquery.dataTables.min.js"></script>
<script src="__STATICURL__/js/matrix.js"></script>
<script src="__STATICURL__/js/matrix.tables.js"></script>
<script type="text/javascript" src="__STATICURL__/js/highcharts.js"></script>
<script type="text/javascript" src="__STATICURL__/js/exporting.js"></script>
</body>
</html>
<script>
    var pnumData = new Array();
    <
    ? php foreach($pnum as $k = > $v
    )
    {
        ?
    >
        pnumData.push( < ? = $v ?
    >)
        ;
    <
        ? php
    }
    ?
    >
    $(function () {
        $('#container').highcharts({
            chart: {
                type: 'column',
                margin: [50, 50, 100, 80]
            },
            title: {
                text: '推广链接 2015'
            },
            xAxis: {
                categories: [
                    'Dubooker',
                    '成铭(dsk002)',
                    '管婷婷(dsk004)',
                    '张宇(dsk005)',
                    '田甜(dsk006)',
                    '肖立娇(dsk008)',
                    '杨利丹(dsk009)',
                    '穆海迪(dsk010)',
                    '萨楚拉(dsk011)',
                    '谌露萍(dsk012)',
                    '潘璠(dsk013)',
                    '武健(dsk014)',
                    '柏凯(dsk018)',
                    '李海娇dsk019'
                ],
                labels: {
                    rotation: -45,
                    align: 'right',
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif'
                    }
                }
            },
            yAxis: {
                min: 0,
                title: {
                    text: '推广数目 (个)'
                }
            },
            legend: {
                enabled: false
            },
            tooltip: {
                pointFormat: '统计链接: <b>{point.y} 个</b>',
            },
            series: [{
                name: 'Population',
                data: pnumData,
                dataLabels: {
                    enabled: true,
                    rotation: -90,
                    color: '#FFFFFF',
                    align: 'right',
                    x: 4,
                    y: 10,
                    style: {
                        fontSize: '13px',
                        fontFamily: 'Verdana, sans-serif',
                        textShadow: '0 0 3px black'
                    }
                }
            }]
        });
    });
</script>
<script src="__STATICURL__/js/datetimepicker/jquery.datetimepicker.js"></script>
<script type="text/javascript">
    $('#starttime').datetimepicker({
        timepicker: false,
        lang: "ch",
        format: 'Y-m-d',
        formatDate: 'Y-m-d',
        validateOnBlur: false,
        onShow: function (ct) {
            this.setOptions({
                maxDate: jQuery('#endtime').val() ? jQuery('#endtime').val() : false
            })
        }

    });
    $('#endtime').datetimepicker({
        timepicker: false,
        lang: "ch",
        format: 'Y-m-d',
        formatDate: 'Y-m-d',
        validateOnBlur: false,
        onShow: function (ct) {
            this.setOptions({
                minDate: jQuery('#starttime').val() ? jQuery('#starttime').val() : false
            })
        }
    });
    jQuery('#starttime').datetimepicker({
        timepicker: false,
        scrollInput: false,
        onSelectDate: function (dp, $input) {
            window.location.href = "__URL__/chart?start_time=" + $input.val() + "&end_time=<?=$end_time?>";
        }
    });
    jQuery('#endtime').datetimepicker({
        timepicker: false,
        scrollInput: false,
        onSelectDate: function (dp, $input) {
            window.location.href = "__URL__/chart?end_time=" + $input.val() + "&start_time=<?=$start_time?>";
        }
    });

</script>